<template>
  <div>
     <!-- 测试时加上 /dev-api/  打包时 删掉 -->
    <el-upload
      action="/admin/order/import" 
      :headers="{
        token: accessToken,
      }"
      :name="'expressNoFile'"
      :limit="1"
      accept=".xlsx, .xls"
      :on-success="handleSuccess"
      :on-error="handleError"
      :before-upload="beforeUpload"
    >
      <el-button type="primary">点击上传Excel文件</el-button>
      <!-- <template #tip>
        <div class="el-upload__tip">
          请上传 .xlsx 或 .xls 格式的Excel文件
        </div>
      </template> -->
    </el-upload>
  </div>
</template>

<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { Auth } from "@/utils/auth";

const accessToken = Auth.getAccessToken();
// 上传前的校验
const beforeUpload = (file: File) => {
  const isExcel = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || 
                 file.type === 'application/vnd.ms-excel'
  const isLt10M = file.size / 1024 / 1024 < 10

  if (!isExcel) {
    ElMessage.error('只能上传Excel文件!')
    return false
  }
  if (!isLt10M) {
    ElMessage.error('文件大小不能超过10MB!')
    return false
  }
  return true
}

// 上传成功回调
const handleSuccess = (response: any) => {
  ElMessage.success('文件上传成功')
  console.log('服务器返回:', response)
  // 这里可以添加成功后的逻辑，如刷新列表等
}

// 上传失败回调
const handleError = () => {
  ElMessage.error('文件上传失败')
}
</script>
